import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    // 基础信息
    title: '标题', // 曲谱标题
    subtitle: '副标题', // 曲谱副标题
    composer: '作曲者', // 作曲者
    lyricist: '作词者', // 作词者
    copyright: '双手简谱', // 水印名称
    // 曲谱信息
    beat: '4/4', // 节拍
    key: 'C', // 调号
    scoreType: '双声部', // 谱表类型
    tempo: 120 // 速度数值
  },
  getters: {
    scoreDraft: state => ({
      title: state.title,
      subtitle: state.subtitle,
      composer: state.composer,
      lyricist: state.lyricist,
      copyright: state.copyright,
      beat: state.beat,
      key: state.key,
      scoreType: state.scoreType,
      tempo: state.tempo
    })
  },
  mutations: {
    setScoreDraft(state, payload) {
      // 批量设置所有字段
      Object.keys(payload).forEach(key => {
        if (state.hasOwnProperty(key)) {
          state[key] = payload[key]
        }
      })
    }
  },
  actions: {
    setScoreDraft({ commit }, payload) {
      commit('setScoreDraft', payload)
    }
  },
  modules: {
  },
  plugins: [createPersistedState({
    key: 'jianpu-editor',
    storage: window.localStorage
  })]
})
